import React from 'react';
import { Form, Input, Button, Space, Select, Tooltip, DatePicker } from 'antd';
import { ReloadOutlined, SearchOutlined } from '@ant-design/icons';
import { adminCompanyType } from '@/utils/constant';
import {
  btnPermission,
  downloadFile,
  formatDate,
  formatDateTimeStamp,
} from '@/utils/utils';
import { history } from '@@/core/history';
import {
  apiProduceScheduleExport,
  apiSaleExport,
} from '@/services/otherServices';
import { admin_prefix, admin_url } from '../../../config/admin.config';
import moment from 'moment';

const Search = (props: any) => {
  const [form] = Form.useForm();
  const { callbackValue, loading, pageSize, searchValue } = props;
  const onFinish = (values: any) => {
    if (values.time) {
      values['startDate'] = values.time[0].format('YYYY/MM/DD');
      values['endDate'] = values.time[1].format('YYYY/MM/DD');
    }
    delete values.time;
    callbackValue(values);
  };
  return (
    <Form
      style={{ display: 'flex', flexWrap: 'wrap' }}
      form={form}
      name="control-hooks"
      onFinish={onFinish}
    >
      {btnPermission(history.location.pathname, 'btn_sale_search') && (
        <>
          <Form.Item name="orderNo" style={{ marginBottom: 10, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入订单号'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="customerCompany" style={{ margin: 0, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入客户单位'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="productName" style={{ margin: 0, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入品名'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="color" style={{ margin: 0, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入颜色'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="attribute" style={{ margin: 0, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入属性'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="spec" style={{ margin: 0, width: 150 }}>
            <Input style={{ width: 150 }} placeholder={'请输入规格'} />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item name="time" style={{ marginBottom: 10, width: 250 }}>
            <DatePicker.RangePicker
              style={{ width: 250 }}
              placeholder={['送货开始时间', '送货结束时间']}
            />
          </Form.Item>
          <span style={{ padding: 4 }} />
          <Form.Item style={{ margin: 0 }}>
            <Space>
              <Tooltip title="搜索">
                <Button
                  disabled={loading}
                  type="primary"
                  htmlType="submit"
                  icon={<SearchOutlined />}
                />
              </Tooltip>
            </Space>
          </Form.Item>
        </>
      )}
      {btnPermission(history.location.pathname, 'btn_sale_export') && (
        <Form.Item style={{ margin: '0 0 0 8px' }}>
          <>
            <Button
              onClick={() => {
                const values = form.getFieldsValue();
                apiSaleExport({
                  ...values,
                }).then((res: any) => {
                  downloadFile(res);
                });
              }}
              type={'primary'}
            >
              导出
            </Button>
          </>
        </Form.Item>
      )}
    </Form>
  );
};

export default Search;
